import ProCard from '@ant-design/pro-card';
import React from 'react';
import styles from '@/pages/trade/Item/index.less';
import { connect } from 'umi';
import "video-react/dist/video-react.css";
import { Player } from 'video-react';

import FileViewer from 'react-file-viewer';
import { Image } from 'antd';

const PreviewCard = (props) => {
  const { item } = props;

  const imageCard = item && (
    <ProCard className={styles.itemCard} title="作品预览" headerBordered layout="center">
      <Image src={`/api/getFile/?fileHash=${item.fileHash}`} />
    </ProCard>
  );

  const videoCard = item && (
    <ProCard className={styles.itemCard} title="作品预览" headerBordered layout="center">
      <Player
        playsInline
        //poster="/assets/poster.png"
        src={`/api/getFile/?fileHash=${item.fileHash}`}
      />

    </ProCard>
  );

  switch(item.category){
    case 2:
      return imageCard;
    case 3:
      return videoCard;
    default:
      return ""
  }
};

export default connect(({ item }) => ({
  item: item.item,
}))(PreviewCard);
